import React, { Component } from 'react'
import { Layout, Menu, Breadcrumb } from 'antd';
import { Route, Routes, Router, Link } from 'react-router-dom'
// import img from '../../../public/images'
// import About from '../../router/About';
import Routers from '../../util/routers'
import { UserOutlined, LaptopOutlined, NotificationOutlined } from '@ant-design/icons';
import './index.css';
const { SubMenu } = Menu;
const { Header, Content, Sider } = Layout;
export default class Home extends Component {
    render() {
        return (
            <div>
                <Layout>
                    <Header className="header">
                        <div className="logo"><img src="../../../public/images/logo.png" /></div>
                        <Menu theme="dark" mode="horizontal" defaultSelectedKeys={['2']}>
                        </Menu>
                        <div>
                            <a>切换小区</a>
                        </div>
                    </Header>
                    <Layout>
                        <Sider width={200} className="site-layout-background">
                            <Menu
                                mode="inline"
                                defaultSelectedKeys={['1']}
                                defaultOpenKeys={['sub1']}
                                style={{ height: '100%', borderRight: 0 }}
                            >
                                <SubMenu key="sub1" icon={<UserOutlined />} title="智慧大屏">
                                    <Menu.Item key="1">屏幕</Menu.Item>
                                </SubMenu>
                                <SubMenu key="sub2" icon={<LaptopOutlined />} title="智慧社区">
                                    {/* <Menu.Item key="5"><Link to='/about'>社区概况</Link></Menu.Item> */}
                                    {/* <Menu.Item key="6"><Link to='/home'>人员信息</Link></Menu.Item> */}
                                    <Menu.Item key="7">房屋信息</Menu.Item>
                                    <Menu.Item key="8">车辆信息</Menu.Item>
                                    <Menu.Item key="9">权限管理</Menu.Item>
                                </SubMenu>
                                <SubMenu key="sub3" icon={<NotificationOutlined />} title="智慧安防">
                                    <Menu.Item key="10">网格人员</Menu.Item>
                                    <Menu.Item key="11">预警信息</Menu.Item>
                                    <Menu.Item key="12">关爱人员</Menu.Item>
                                    <Menu.Item key="13">重点人员</Menu.Item>
                                    <Menu.Item key="14">人像循迹</Menu.Item>
                                    <Menu.Item key="15">进出级别</Menu.Item>
                                    <Menu.Item key="16">设备管理</Menu.Item>
                                </SubMenu>
                                <SubMenu key="sub4" icon={<NotificationOutlined />} title="党群建设">
                                    <Menu.Item key="17">组织概况</Menu.Item>
                                    <Menu.Item key="18">党员管理</Menu.Item>
                                    <Menu.Item key="19">党群活动</Menu.Item>
                                </SubMenu>
                                <SubMenu key="sub5" icon={<NotificationOutlined />} title="疫情登记">
                                    <Menu.Item key="20">疫情登记</Menu.Item>
                                </SubMenu>
                                <SubMenu key="sub6" icon={<NotificationOutlined />} title="智慧民生">
                                    <Menu.Item key="21">网格管理</Menu.Item>
                                    <Menu.Item key="22">军退管理</Menu.Item>
                                    <Menu.Item key="23">政务服务</Menu.Item>
                                    <Menu.Item key="24">业主自治</Menu.Item>
                                </SubMenu>
                            </Menu>
                        </Sider>
                        <Layout style={{ padding: '0 24px 24px' }}>
                            <Breadcrumb style={{ margin: '16px 0' }}>
                                {/* <Breadcrumb.Item>Home</Breadcrumb.Item>
                                <Breadcrumb.Item>List</Breadcrumb.Item>
                                <Breadcrumb.Item>App</Breadcrumb.Item> */}
                            </Breadcrumb>
                            <Content
                                className="site-layout-background"
                                style={{
                                    padding: 24,
                                    margin: 0,
                                    minHeight: 280,
                                }}
                            >
                                {/* <Routers/> */}
                            </Content>
                        </Layout>
                    </Layout>
                </Layout>,
            </div>
        )
    }
}
